<template>
	<view class="invite-page">
		<view class="invite-contain">
			<view class="invite-staff-detail" v-if="page_type == 'actOn'">
				<image :src="actInfo.customer[0].avatar" mode=""></image>
				<view class="staff-title">{{ actInfo.customer[0].nickname}}</view>
				<view class="invite-tip">邀请你一起参加下面活动</view>
			</view>
			<view class="invite-staff-detail" v-else>
				<image :src="actInfo.customer.avatar" mode=""></image>
				<view class="staff-title">{{actInfo.customer.nickname}}</view>
				<view class="invite-tip">邀请你一起参加下面活动</view>
			</view>
			<view class="invite-act-content">
				<image v-if="page_type == 'actOn'" :src="actInfo.image[0].image"></image>
				<image v-else :src=" actInfo.cover_image"></image>
			</view>
			<view class="invite-content">
				{{ (actInfo.name || actInfo.title) | goodName}}
			</view>
		</view>
		<view class="generalize-act" @click="generalizeAct">
			立刻推广活动赚钱
		</view>
		<!-- 提示不是员工弹框 -->
		<uni-popup ref="actReminder" :custom="true">
			<view class="popup_box_de">
				<view class="popup_box-tip">
					参与提示
				</view>
				<view class="popup_box-reminder">
					你暂时不是店铺员工，请联系店铺负责人，邀请你加入
				</view>
				<view class="popup_box-click">
					<view class="" @click="know">取消</view>
					<view class="" @click="know">知道了</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import uniPopup from '../../../../components/uni-popup/uni-popup.vue'
	import { userLogin } from '@/common/login.js';
	export default{
		filters: {
			goodName(value) {
				if (!value) return ''
				if (value.length > 40) {
					return value.slice(0, 40) + '...'
				}
				return value
			}
		},
		components:{uniPopup},
		data(){
			return {
				currentPge:'',
				activity_id:'',
				token:'',
				store_id:'',
				actInfo:{},
				page_type:'',
				active_type:'',
				customer_info:"",
				share_customer_id:''
			}
		},
		onLoad(option) {
			this.activity_id = option.actId
			// #ifdef H5
				let pages = getCurrentPages()
				this.currentPge = pages[0].$route.fullPath
			// #endif
						
			// this.share_customer_id = option.customer_id
			let store_id = parseInt(option.store_id,10);
			if(!store_id>0){
				store_id = uni.getStorageSync('store_id')
			}else{
				uni.setStorageSync('store_id', store_id)
			}
			this.store_id = store_id
			this.$store.commit('updateStoreId',store_id)
			
			let token = option.token;
			if(!token){
				token = uni.getStorageSync('token')
			}else{
				uni.setStorageSync('token', token);
			}
			this.token = token
			this.$store.commit('updateToken',token)
			uni.setStorageSync('share_id',option.customer_id)
			if(!this.$store.getters.getToken){
				console.log('11111111134')
				// #ifdef H5
				location.href = this.$store.state.URL + "/customer/user/wx_login?page=" + encodeURIComponent(this.currentPge)
				// #endif 
			}else{
				this.page_type = option.page_type
			}
			this.page_type = option.page_type
			console.log(1342,this.page_type);
			
			// this.actMsg = uni.getStorageSync('inviteStaffAct')
			// console.log(this.actMsg,'邀请员工的活动信息')
			
			//  去除分享链接中分享者的token
			const stateObj = this.currentPge
			let pattern = /(&token+.*&)|(&token+.*)/
			this.currentPge = this.currentPge.replace(pattern, '&')
			// #ifdef H5
				history.replaceState(stateObj, "", this.currentPge)
			// #endif
			
			
			//没有登录过，跳回首页登录
			if(!this.token){
				console.log(134,option);
				uni.reLaunch({
					url:'/pages/home/organization/organization?option='+JSON.stringify(option)
				})
			}
			// // #ifdef MP-WEIXIN
			// 	userLogin().then((res)=>{
			// 		console.log(res)
			// 		console.log(555555)
			// 	});
			// // #endif
			
		},
		onShow() {
			if(this.$store.getters.getToken){
				this.getCustomer()
			}else if(this.token){
				this.getCustomer()
			}
		},
		methods:{
			know(){
				this.$refs.actReminder.close()
				setTimeout(()=>{
					if(this.active_type == 'qrcode'){
						uni.redirectTo({
							url: '../../../memberCenter/memberCenter?store_id=' + this.store_id + '&page=details&actId=' + this.activity_id
						});
					}else{
						uni.redirectTo({
							url: '../../../home/home?store_id=' + this.store_id
						});
					}
				},1000)
			},
			getCustomer(){
				
				const data = {
					token:this.token,
					store_id:this.store_id
				}
				this.$api.getCustomerInfo(data).then(res => {
					console.log(res)
					if(res.status){
						this.customer_info = res.data.userinfo
						console.log(this.customer_info,'当前用户信息')
						this.gainShareAct()
					}
				}).catch(err => {
					console.log(err)
				})
				// let customer_info = this.$api.getCustomerInfo(data)
				// console.log(this.customer_info)
				
			},
			judgeMsg(){
				console.log(this.page_type);
				if(this.page_type == 'actOn'){
					let data = {
						token:this.token,
						store_id:this.store_id,
						activity_id:this.activity_id
					}
					this.$api.judge_user_staff(data).then(res => {
						console.log(res,111)
						if(res.status){
							if(res.jud == 1){
								this.$refs.actReminder.open()
								return
							}else if(res.jud == 2){
								uni.showToast({
									title:'您已是员工，但还未参与活动哦',
									icon:'none',
									duration:2000
								})
								setTimeout(()=> {
									if(this.active_type == 'qrcode'){
										uni.redirectTo({
											url: '../../../memberCenter/memberCenter?store_id=' + this.store_id + '&page=details&actId=' + this.activity_id
										});
									}else{
										uni.redirectTo({
											url: '../../../home/organization/activeDetail-3?store_id=' + this.store_id + '&page=details&actId=' + this.activity_id
										});
									}
								},1000)
								return
							}else if(res.jud == 3){
								if(this.active_type == 'qrcode'){
									uni.redirectTo({
										url: '../../../memberCenter/memberCenter?store_id=' + this.store_id
									});
								}else{
									uni.redirectTo({
										url: '../../../home/organization/activeDetail-3?store_id=' + this.store_id + '&page=details&actId=' + this.activity_id
									});
								}
							}
						}
					}).catch(err => {
						console.log(err,1)
					})
				}else{
					let data = {
						token:this.token,
						store_id:this.store_id,
						collect_info_id:this.activity_id,
						// share_customer_id:this.share_customer_id
					}
					this.$api.judge_join_act_down(data).then(res => {
						console.log(res)
						if(res.status){
							if(res.jud == 1){
								this.$refs.actReminder.open()
							}else if(res.jud == 2){
								uni.showToast({
									title:'您已是本店铺的员工，但还未参与此活动！',
									icon:'none',
									duration:2000
								})
								setTimeout(()=>{
									uni.redirectTo({
										url: '../../../memberCenter/formGatherManage/formGatherManage?store_id=' + this.store_id
									});
								},1000)
							}else{
								uni.redirectTo({
									url: '../../../memberCenter/formGatherManage/formGatherManage?store_id=' + this.store_id
								});
							}
						}
					}).catch(err => {
						console.log(err)
					})
				}
				
			},
			gainShareAct(){
				console.log(1342594,this.page_type,this.activity_id);
				if(this.page_type == 'actOn'){
					let data = {
						token:this.token,
						activity_id:this.activity_id
					}
					this.$api.gain_all_act(data).then(res => {
						console.log(this.activity_id,"内容")
						if(res.status){
							this.actInfo = res.list.data[0]
							this.active_type = res.list.data[0].active_type
							console.log('1345',this.actInfo)
						}
					}).catch(err => {
						console.log(err)
					})
				}else{
					let data = {
						token:this.token,
						store_collect_info_id:this.activity_id
					}
					this.$api.gain_act_id_down(data).then(res => {
						console.log(res)
						if(res.status){
							this.actInfo = res.list.data[0]
							console.log('1341',this.page_type);
						}
					}).catch(err => {
						console.log(err)
					})
				}
			},
			// cancel(){
			// 	this.$refs.actReminder.close()
			// },
			generalizeAct(){
				// this.$refs.actReminder.open()
				this.judgeMsg()
			}
		}
	}
</script>

<style>
	/* 弹框样式 */
	.popup_box_de{
		height: 336upx;
		width: 640upx;
		background: #FFFFFF;
		border-radius: 24upx;
		padding-top: 40upx;
		box-sizing: border-box;
	}
	.popup_box-tip{
		text-align: center;
		color: #353535;
		font-size: 36upx;
		font-weight: 800;
	}
	.popup_box-reminder{
		width: 544upx;
		text-align: center;
		padding: 0 10upx;
		box-sizing: border-box;
		color: #666666;
		font-size: 30upx;
		margin: 0 auto;
		margin-top: 30upx;
	}
	.popup_box-click{
		width: 100%;
		height: 112upx;
		margin-top: 38upx;
		border-top: 1upx solid rgba(0, 0, 0, 0.1);
		display: flex;
	}
	.popup_box-click>view{
		width: 50%;
		line-height: 112upx;
		text-align: center;
		font-size: 34upx;
	}
	.popup_box-click>view:first-child{
		color: #000000;
		border-right: 1upx solid rgba(0, 0, 0, 0.1);
	}
	.popup_box-click>view:last-child{
		color: #FF8B46;
	}
	page{
		background: url(https://tool.tuanhaoke.cn/static/image/member/active_image_share.png) no-repeat;
		background-size: 100% 100%;
		padding-bottom: 30upx;
		box-sizing: border-box;
	}
	.invite-page{
		width: 100%;
		padding: 0 30upx;
		padding-top: 462upx;
		box-sizing: border-box;
	}
	.invite-contain{
		width: 100%;
		/* height: 632upx; */
		background: #FFFFFF;
		border: 4upx solid #FFDC34;
		box-shadow: 0 4upx 28upx 0 rgba(248, 41, 45, 0.58);
		border-radius: 20upx;
		padding: 0 20upx;
		padding-bottom: 20upx;
		box-sizing: border-box;
	}
	.invite-staff-detail{
		width: 100%;
		display: flex;
		padding: 30upx 0;
		box-sizing: border-box;
	}
	.invite-staff-detail>image{
		width: 72upx;
		height: 72upx;
		border-radius: 50%;
	}
	.staff-title{
		color: #333;
		font-size: 28upx;
		line-height: 72upx;
		margin-left: 20upx;
		margin-right: 10upx;
	}
	.invite-tip{
		font-size: 24upx;
		color: #999999;
		line-height: 72upx;
	}
	.invite-act-content{
		width: 100%;
		height: 366upx;
	}
	.invite-act-content>image{
		width: 100%;
		height: 100%;
	}
	.invite-content{
		margin-top: 20upx;
		color: #333333;
		font-size: 30upx;
		font-weight: 800;
	}
	.generalize-act{
		width: 638upx;
		height: 96upx;
		line-height: 96upx;
		text-align: center;
		font-weight: 800;
		margin: 0 auto;
		margin-top: 80upx;
		color: #FF391F;
		font-size: 32upx;
		background: linear-gradient(to right,#FFEC71,#FFD44A);
		border-radius: 44upx;
		box-shadow: 0 8upx 0 0 #F99622,
		0 4upx 10upx 0 rgba(255, 255, 255, 0.5) inset;
		
	}
</style>
